<template>
    <div class="app-container">
        <el-form class="lookForm" :model="queryParams" ref="queryForm" size="mini" :inline="true" label-width="140px">
            <el-form-item label="岗位名称" prop="postName">
                <el-input v-model="queryParams.postName" placeholder="请输入岗位名称" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="设岗部门" prop="deptName">
                <el-input v-model="queryParams.deptName" placeholder="请输入设岗部门" clearable
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="审核状态" prop="applyStatus">
                <el-select v-model="queryParams.applyStatus" placeholder="请选择审核状态" clearable>
                    <el-option v-for="dict in dict.type.qgzx_apply_status" :key="dict.value" :label="dict.label"
                        :value="dict.value" />
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

        <el-table v-loading="loading" :data="tableData">
            <el-table-column label="#" align="center" prop="id" />
            <el-table-column label="学号" align="center" prop="stuNo" />

            <el-table-column label="姓名" align="center" prop="stuName" />
            <el-table-column label="学院" align="center" prop="stuDept" />

            <el-table-column label="岗位名称" align="center" prop="postName" />
            <el-table-column label="设岗部门" align="center" prop="deptName" />
            <el-table-column label="岗位类型" align="center" prop="postType" />

            <el-table-column label="工作时长" align="center">
                <template v-slot="{ row }">
                    {{ row.postType == "固定岗位A" ? row.totalTime + "天" : row.totalTime + "小时" }}
                </template>
            </el-table-column>
            
            <el-table-column label="结算月份" align="center">
                <template v-slot="{ row }">
                    {{ formatDate(row.applyTime) }}
                </template>
            </el-table-column>

            <!-- <el-table-column label="薪资" align="center" prop="applyStatus">
                <template slot-scope="scope">
                    {{ scope.row.postType == "固定岗位A" ? "待部门导出查看" : scope.row.totalTime * 15 }}
                </template>
            </el-table-column> -->

            <el-table-column label="审核状态" align="center" prop="applyStatus">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.qgzx_apply_status" :value="scope.row.applyStatus" />
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-view" @click="lookVClick(scope.row)">查看</el-button>
                </template>
            </el-table-column>
        </el-table>



        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="getList" />


        <el-dialog title="查看" :visible.sync="lookV">
            <el-form class="lookForm" size="mini" label-width="148px">
                <el-form-item label="学生">
                    <el-input v-model="lookForm.stuName" readonly />
                </el-form-item>
                <el-form-item label="岗位">
                    <el-input v-model="lookForm.postName" readonly />
                </el-form-item>
                <el-form-item label="总工作时长">
                    <el-input v-model="lookForm.totalTime" readonly />
                </el-form-item>
                <el-form-item label="指导老师签章">
                    <img v-if="lookForm.applySign" :src="baseurl + lookForm.applySign" width="200px" height="50px"
                        class="avatar">
                </el-form-item>
                <hr />
                <el-form-item label="部门意见" v-if="!isEmpty(lookForm.deptCmt)">
                    <el-input readonly v-model="lookForm.deptCmt" />
                </el-form-item>
                <el-form-item label="部门签章" v-if="!isEmpty(lookForm.deptSign)">
                    <img v-if="lookForm.deptSign" :src="baseurl + lookForm.deptSign" width="200px" height="50px"
                        class="avatar">
                </el-form-item>
                <hr />
                <el-form-item label="资助办意见" v-if="!isEmpty(lookForm.highCmt)">
                    <el-input readonly v-model="lookForm.highCmt" />
                </el-form-item>
                <el-form-item label="资助办签章" v-if="!isEmpty(lookForm.highSign)">
                    <img v-if="lookForm.highSign" :src="baseurl + lookForm.highSign" width="200px" height="50px"
                        class="avatar">
                </el-form-item>
                <hr />
                <el-form-item label="学工处意见" v-if="!isEmpty(lookForm.finalCmt)">
                    <el-input readonly v-model="lookForm.finalCmt" />
                </el-form-item>
                <el-form-item label="学工处签章" v-if="!isEmpty(lookForm.finalSign)">
                    <img v-if="lookForm.finalSign" :src="baseurl + lookForm.finalSign" width="200px" height="50px"
                        class="avatar">
                </el-form-item>

            </el-form>
        </el-dialog>

    </div>
</template>
<script>

import { CheckImgExists, fullLoading, isEmpty } from "@/api/helpFunc";
import TeacherOwnStuPostSelect from "@/views/workstudy/components/TeacherOwnStuPostSelect";

import { getToken } from "@/utils/auth";


import { doAudit, listStu as getList } from "@/api/workstudy/money";


export default {
    name: "Money",
    dicts: ['qgzx_apply_status'],
    components: { TeacherOwnStuPostSelect },
    data() {
        return {
            editV: false,
            applyForm: {
                stuPostId: null
            },
            upload: {
                headers: { Authorization: "Bearer " + getToken() },
                // 上传的地址
                url: process.env.VUE_APP_BASE_API + "/common/upload"
            },
            baseurl: process.env.VUE_APP_BASE_API + "/",
            isEmpty,
            loading: false,

            tableData: [],
            total: 0,
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                postName: null
            },
            lookForm: {},

            lookV: false,

            auditForm: {
                id: null,
                deptCmt: null
            }
        }
    },
    created() {
        this.getList();
    },
    methods: {
        formatDate(dateStr) {
            const date = new Date(dateStr);
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份是从0开始的，所以需要+1
            return `${year}年${month}月`;
        },
        async lookVClick(row) {
            this.lookForm = {};
            this.lookForm = { ...row };
            this.lookV = true;
        },

        async getList() {
            this.loading = true;
            let res = await getList(this.queryParams);
            this.loading = false;
            if (res.code == 200) {
                this.tableData = [...res.rows];
                this.total = res.total;
            }
        },
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },

        handleAvatarSuccess(response, file, fileList) {
            this.auditForm.deptSign = response.fileName;
            this.$forceUpdate();
        },
        async doAudit() {
            let sdata = { ...this.auditForm };
            if (isEmpty(sdata.deptCmt)) {
                this.$message.info("请选择部门意见");
                return;
            }
            if (isEmpty(sdata.deptSign)) {
                this.$message.info("请上传部门签章");
                return;
            }

            if (!CheckImgExists(this.baseurl + sdata.deptSign)) {
                this.$message.info("签名失效，请重新上传");
                return;
            }

            if (sdata.deptCmt == '同意') {
                sdata.applyStatus = '2';
            } else {
                sdata.applyStatus = "10";
            }

            let loading = fullLoading(this);
            let res = await doAudit(sdata);
            loading.close();
            if (res.code == 200) {
                this.getList();
                this.$message.success(res.msg);
                this.lookV = false;
            }
        }
    }
}


</script>

<style scoped lang="scss">
.lookForm {
    .el-form-item {
        margin-bottom: 5px;
    }
}
</style>